<?xml version="1.0" encoding="ISO-8859-1" ?>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<%@ page import="beans.Timer" %>
<%@ page import="beans.Memory" %>
<%@ page import="beans.Card" %>
<jsp:useBean id="counter" class="beans.Timer" scope="session"/>
<jsp:useBean id="memory" class="beans.Memory" scope="session"/>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
		<title>EWA Memory :: Spiel 1</title>
		<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8"/>
		<meta name="description" content="Das EWA Memory, ein Spass der niemals endet."/>
		<meta name="keywords" content="Spiel EWA memory"/>
		<meta name="language" content="de-AT"/>
		<link rel="stylesheet" type="text/css" href="styles/screen.css"/>
	</head>
	<body>
		<div id="wrapper">
			<div id="header">
				<div id="teaser"></div>
				<div id="logo"></div>
				<h1>EWA Memory</h1>
			</div>
			<ul class="accessibility">
				<li><a href="#navigation" accesskey="1">Navigation</a></li>
				<li><a href="#board" accesskey="0">Spielbrett</a></li>
				<li><a href="#score" accesskey="2">Spielstand</a></li>
			</ul>
			<div id="body">
				<div id="navigation">
					<h2 class="accessibility">Navigation</h2>
					<ul>
						<li><a href="#">Userdaten &auml;ndern</a></li>
						<li><a href="#">Zur&uuml;ck zur Lounge</a></li>
						<li><a href="#">Ausloggen</a></li>
					</ul>
				</div>
				<hr class="accessibility" />				
				<div id="info_area">
					<h2>Spielstand</h2>
					<table id="score" summary="Diese Tabelle zeigt den aktuellen Spielstand">
						<tbody>
							<tr>
								<th class="accessibility">Label</th>
								<th>Du</th>
								<th>Gegner</th>
							</tr>
							<tr>
								<th class="label">Paare</th>
								<td><% out.print(memory.getGefundenePaare());%></td>
								<td>0</td>
							</tr>
							<tr>
								<th class="label">Versuche</th>
								<td><% out.print(memory.getVersuche());%></td>
								<td>0</td>
							</tr>
							<tr>
								<th class="label">Zeit</th>
								<td>  
								<%
							    out.println(counter.getCounter());
  								%>					
  								</td>
								<td>0:00</td>
							</tr>
						</tbody>
					</table>
					<h2>Spielinformationen</h2>
					<table id="game_info" summary="Diese Tabelle zeigt weitere Informationen zum aktuellen Spiel">
						<tbody>
							<tr class="accessibility">
								<th>Information</th>
								<th>Wert</th>
							</tr>
							<tr>
								<th>Restliche Paare</th>
								<td><%out.print(memory.getRestlichePaare()); %></td>
							</tr>
						</tbody>
					</table>
					<h2>Highscore</h2>
					<ul id="unknown">
						<li>Petra: 165 Punkte</li>
						<li>Manuel: 128 Punkte</li>
						<li>Lena: 115 Punkte</li>
						<li>Andi: 99 Punkte</li>
					</ul>
				</div>
				<div id="play_area">
					<hr class="accessibility" />
					<div id="board">
						<h2 class="accessibility">Spielbrett</h2>
						<ol>
						<%
						int i = 0;
						for(Card c : memory.getFeld()){
							out.print("<li title=\"Karte "+ i + "\" class=\""+ memory.getFeld().get(i).getCSSStyle() +"\"><a href=\"http://localhost:8080/Memory/Spiellogik?c=" + i + "\"><img src=\"" + memory.getFeld().get(i).getCurrentUrl() + "\" alt=\"" + memory.getFeld().get(i).getCurrentAlt() + "\"/></a></li>");
							i++;
						}
						
						%>
						</ol>
						<!--
						<ol>
						<li title="Zeile 1, Spalte 1" class="<% out.print(memory.getFeld().get(0).getCSSStyle()); %>"><a href="http://localhost:8080/Memory/HalloWelt?c=0"><img src="<% out.print(memory.getFeld().get(0).getCurrentUrl());%>" alt="<% out.print(memory.getFeld().get(0).getCurrentAlt());%>"/></a></li>
						<li title="Zeile 2, Spalte 2" class="<% out.print(memory.getFeld().get(1).getCSSStyle()); %>"><a href="http://localhost:8080/Memory/HalloWelt?c=1"><img src="<% out.print(memory.getFeld().get(1).getCurrentUrl());%>" alt="<% out.print(memory.getFeld().get(1).getCurrentAlt());%>"/></a></li>
						<li title="Zeile 3, Spalte 1" class="<% out.print(memory.getFeld().get(2).getCSSStyle()); %>"><a href="http://localhost:8080/Memory/HalloWelt?c=2"><img src="<% out.print(memory.getFeld().get(2).getCurrentUrl());%>" alt="<% out.print(memory.getFeld().get(2).getCurrentAlt());%>"/></a></li>
						<li title="Zeile 4, Spalte 2" class="<% out.print(memory.getFeld().get(3).getCSSStyle()); %>"><a href="http://localhost:8080/Memory/HalloWelt?c=3"><img src="<% out.print(memory.getFeld().get(3).getCurrentUrl());%>" alt="<% out.print(memory.getFeld().get(3).getCurrentAlt());%>"/></a></li>
						<li title="Zeile 5, Spalte 1" class="<% out.print(memory.getFeld().get(4).getCSSStyle()); %>"><a href="http://localhost:8080/Memory/HalloWelt?c=4"><img src="<% out.print(memory.getFeld().get(4).getCurrentUrl());%>" alt="<% out.print(memory.getFeld().get(4).getCurrentAlt());%>"/></a></li>
						<li title="Zeile 6, Spalte 2" class="<% out.print(memory.getFeld().get(5).getCSSStyle()); %>"><a href="http://localhost:8080/Memory/HalloWelt?c=5"><img src="<% out.print(memory.getFeld().get(5).getCurrentUrl());%>" alt="<% out.print(memory.getFeld().get(5).getCurrentAlt());%>"/></a></li>
						</ol>
						-->
						<div class="clearer"></div>
					</div>
				</div>				
			</div>
			<div id="footer">
				<p>&copy; 2011 EWA Memory.</p>
			</div>
		</div>
	</body>
</html>
